<template>
	<view class="printSet">
		<view class="top">
			打印设置
		</view>
		<view class="main">
			<u-button @click="submit">保存</u-button>
			<u-form class='form-cla' :model="form" ref="uForm" label-width='230' label-align='right'>
				<u-form-item label="连打次数:" prop="printNum">
					<u-input v-model="form.printNum" :custom-style='inputStyle' type='number'/>
				</u-form-item>
				<u-form-item label="can_width:" prop="width2">
					<u-input v-model="form.width2" :custom-style='inputStyle' type='number'/>
				</u-form-item>
				<u-form-item label="can_height:" prop="height2">
					<u-input v-model="form.height2" :custom-style='inputStyle' type='number'/>
				</u-form-item>
				<u-form-item label="纸张长度(mm):" prop="width">
					<u-input v-model="form.width" :custom-style='inputStyle' type='number'/>
				</u-form-item>
				<u-form-item label="纸张高度(mm):" prop="height">
					<u-input v-model="form.height" :custom-style='inputStyle' type='number'/>
				</u-form-item>
				
				<u-form-item label="地址:" prop="addr">
					<u-input v-model="form.addr.x" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.addr.y" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.addr.size" :custom-style='inputStyle' type='number' />
				</u-form-item>
				<u-form-item label="姓名:" prop="name">
					<u-input v-model="form.name.x" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.name.y" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.name.size" :custom-style='inputStyle' type='number' />
				</u-form-item>
				<u-form-item label="序号:" prop="num">
					<u-input v-model="form.num.x" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.num.y" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.num.size" :custom-style='inputStyle' type='number' />
				</u-form-item>
				<u-form-item label="菜品:" prop="cai">
					<u-input v-model="form.cai.x" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.cai.y" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.cai.size" :custom-style='inputStyle' type='number' />
				</u-form-item>
				<u-form-item label="备注:" prop="desc">
					<u-input v-model="form.desc.x" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.desc.y" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.desc.size" :custom-style='inputStyle' type='number' />
				</u-form-item>
				<u-form-item label="下单时间:" prop="time">
					<u-input v-model="form.time.x" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.time.y" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.time.size" :custom-style='inputStyle' type='number' />
				</u-form-item>
				
				<u-form-item label="setBox:" prop="setBox">
					<u-input v-model="form.setBox.x1" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.setBox.y1" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.setBox.x2" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.setBox.y2" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.setBox.tt" :custom-style='inputStyle' type='number' />
				</u-form-item>
				<u-form-item label="setBar:" prop="setBar">
					<u-input v-model="form.setBar.x" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.setBar.y" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.setBar.width" :custom-style='inputStyle' type='number' />
					<u-input v-model="form.setBar.height" :custom-style='inputStyle' type='number' />
				</u-form-item>
				
				<u-form-item label="速度:" >
					<u-number-box v-model="form.speed" min='1' max='6'></u-number-box>
				</u-form-item>
				
				<u-form-item label="浓度:" >
					<u-number-box v-model="form.density" min='1' max='15'></u-number-box>
				</u-form-item>
				
				
				<u-form-item label="标签距离(mm):" prop="gap">
					<u-input v-model="form.gap" :custom-style='inputStyle' type='number' />
				</u-form-item>
				
				<u-form-item label="间隔速度(ms):" prop="speed2">
					<u-number-box v-model="form.speed2" min='100' max='500' step='100'></u-number-box>
				</u-form-item>
				
				
			</u-form>
			
		</view>
	</view>
			
</template>

<script>
	export default {
		props: ['hideBluetoothBox', 'show', 'connectStatus'],
		data() {
			return {
				visiable: false,
				
				form: {
					speed: 5,
					density: 10,
					width: 58,
					height: 30,
					width2: 58,
					height2: 30,
					gap: 0,
					speed2: 0,
					setBox:{
						x1:3,
						y1:4,
						x2:8,
						y2:0,
						tt:0,
					},
					setBar:{
						x:100,
						y:200,
						width:40,
						height:0,
					},
					
					printNum: 1,
					addr: {
						x: 90,
						y: 36,
						size: 60
					},name: {
						x: 30,
						y: 120,
						size: 40
					},num: {
						x: 370,
						y: 120,
						size: 40
					},cai: {
						x: 30,
						y: 190,
						size: 24
					},desc: {
						x: 30,
						y: 260,
						size: 24
					},time:{
						x: 250,
						y: 260,
						size: 16
					}
				},
				inputStyle: {
					background: 'whitesmoke',
					paddingLeft: '20rpx',
				},
				
				rules: {
					width: [
						{
							required: true, 
							message: '不能为空', 
							// 可以单个或者同时写两个触发验证方式 
							trigger: ['blur'],
						}
					],
					height: [
						{
							required: true, 
							message: '不能为空', 
							// 可以单个或者同时写两个触发验证方式 
							trigger: ['change'],
						}
					],
					gap: [
						{
							required: true, 
							message: '不能为空', 
							// 可以单个或者同时写两个触发验证方式 
							trigger: ['change'],
						}
					],
					
				}
				
			}
		},
		onLoad() {
			console.log('bluetooth onload--- 这是页面的钩子函数，组件不执行')
		},
		created() {
			this.app = getApp();
		},
		mounted() {
			this.$refs.uForm.setRules(this.rules);
			this.submit()
		},
		
		methods: {
			submit() {
				var _this = this;
				_this.app.globalData.printSet = _this.form
				console.log(_this.form);
				/* this.$refs.uForm.validate(valid => {
					if (valid) {
					} else {
						console.log('验证失败');
					}
				}); */
			},
		},
		

	}
</script>

<style lang="scss">
	.printSet {
		padding-bottom: 100px;
		/deep/ .u-drawer {
			z-index: 100 !important;
		}

		.top {
			background-color: #fff;
			text-align: center;
			padding: 18rpx 0;
			position: relative;
			font-size: 32rpx;
			font-weight: bold;
			line-height: 2;
			margin-bottom: 40rpx;

			
		}
		
		.main {
			padding: 20rpx;
			.form-cla {
				.u-form-left {
					margin-right: 30rpx;
				}
			}
		}
		
		.b-btn {
			background-color: #20bdf6;
			margin: 0 auto 40rpx;
			border-radius: 2rpx;
			color: #fff;
			font-size: 14px;
			width: 128px;
			&.btn-la {
				margin-bottom: 60rpx;
			}
		}
		
	}
</style>